// .jsx -> .tsx
// App <- Hello
// 父组件 向子组件提供props 以便 jsx 输出
// 子组件打工的， prop-types 拒绝裸奔
// 面向对象之中， 父子组件间的约定 负责？
// interface 接口
import * as React from 'react'
// 定义一个接口, 父子组件间用
// 子组件需要实现Props 规定的接口属性和方法
// ts 语法能力，面向对象的能力更强
// ts 可以让我们像java 一样
// 接口定义区
interface Props {
    userName: string;
    age:number;
}
// 接口和组件结合 组件要实现这个接口
// props { } 空对象
// 泛型
// React.FC 类型定义由@types/react提供
const HelloComponent:React.FC<Props> = (props) =>{
    return (
        <h2>
            hello user:{props.userName}!
            <br />
            年纪：{props.age}!
        </h2>
    )
}

export default HelloComponent